<template>
	<view class="work-container">
		<view class="tab_box">
			<view class="tab_nav">
				<view class="navTitle" v-for="(item, index) in navList" :key="index">
					<view :class="{ 'active': isActive === item.index }" @click="checked(item.index)">
						{{ item.title }}
					</view>
				</view>
			</view>
			<view @click="showDiv()">
				<uni-icons class="icon-search" type="search" size="20"></uni-icons>
			</view>
		</view>

		<view :hidden="userFeedbackHidden" class="popup_content">
			<uni-forms ref="form" :modelValue="formRecog" label-width="32%">
				<uni-forms-item :label="$t('search:device')">
					<!-- <view @click="equipment(3)" class="sbBox">
						{{nodeListCopy}}
					</view> -->
					<view @click="handleDevicesOpen" class="sbBox">
						{{ nodeListCopy }}
					</view>
				</uni-forms-item>
				<uni-forms-item :label="$t('search:startTime')">
					<uni-datetime-picker type="datetime" return-type="timestamp" v-model="formRecog.startTime" />
				</uni-forms-item>
				<uni-forms-item :label="$t('search:endTime')">
					<uni-datetime-picker type="datetime" return-type="timestamp" v-model="formRecog.endTime" />
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:alarmId')">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.alarmId"
						:placeholder="$t('warn:enterAlarmId')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('search:name')" v-if="isActive == 1 || isActive == 2">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.faceName"
						:placeholder="$t('search:enterName')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:idNumber')" v-if="isActive == 1 || isActive == 2">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.faceCardId"
						:placeholder="$t('search:enterIdNumber')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('search:plateNumber')" v-if="isActive == 7">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.vehicleInfoPlateNumber"
						:placeholder="$t('search:enterPlate')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('search:faceLibrary')" v-if="isActive == 1 || isActive == 2">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="dataTree" v-model="formRecog.facedbIds" @change="facedbIds" :map="treeChild">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:alarmLevel')" v-if="isActive == 1 || isActive == 2">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="alarmLevelList" v-model="formRecog.monitorLevelId" :map="treeLevel">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:vehicleLibrary')" v-if="isActive == 7">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="carTree" v-model="formRecog.vehicledbIds" @change="vehicledbIds"
						:map="treeCarChild">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:surveillanceTask')">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="controlList" @change="control" v-model="formRecog.monitorIds" :map="treeControl">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:analysisResult')" v-if="isActive == 1 || isActive == 7">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="judgmentResultsList" v-model="formRecog.isAlarm">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:ownerName')" v-if="isActive == 7">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.ownerName"
						:placeholder="$t('warn:enterOwnerName')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:ownerId')" v-if="isActive == 7">
					<input type="text" class="popup_textarea" value="" v-model="formRecog.ownerIdCard"
						:placeholder="$t('warn:enterOwnerId')" />
				</uni-forms-item>
				<uni-forms-item :label="$t('search:vehicleType')" v-if="isActive == 7">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="customMonitorLevelList" v-model="formRecog.vehicleInfoVehicleType">
					</uni-data-picker>
				</uni-forms-item>
				<uni-forms-item :label="$t('warn:isFollowed')">
					<uni-data-picker :placeholder="$t('search:pleaseSelect')" :popup-title="$t('search:pleaseSelect')"
						:localdata="is_concern_options" v-model="formRecog.isConcern">
					</uni-data-picker>
				</uni-forms-item>
			</uni-forms>
			<view class="btn">
				<button type="primary" class="popup_button" @click="submitFeedback()">{{ $t('warn:search') }}</button>
				<button type="primary" class="popup_button" @click="clearFeedback()">{{ $t('warn:reset') }}</button>
			</view>
		</view>
		<view class="popup_overlay" :hidden="userFeedbackHidden" @click="hideDiv()" catchtouchmove="true"></view>
		<view class="nav_item" v-if="isActive == 1">
			<view v-for="item in hmdList" @click="gotoPage(1, item)">
				<hmd-item :item="item"></hmd-item>
			</view>
		</view>
		<view class="nav_item" v-if="isActive == 2">
			<view v-for="item in hmdList" @click="gotoPage(2, item)">
				<msr-item :item="item"></msr-item>
			</view>
		</view>
		<view class="nav_item" v-if="isActive == 7">
			<view v-for="item in hmdList" @click="gotoPage(7, item)">
				<car-item :item="item"></car-item>
			</view>
		</view>

		<devicesTree ref='devicesTree' @onOk="setDevides" />
	</view>
</template>

<script>
import { DBFace2 } from "@/api/rljc.js"
import hmdItem from './components/hmdItem.vue'
import msrItem from './components/msrItem.vue'
import carItem from './components/carItem.vue'
import devicesTree from '@/components/devicesTree/devicesTree.vue'
import {
	getHmd,
	getHmdNo,
	getCar,
	getAlarmLevel,
} from '@/api/warning/index.js'
import {
	getFace
} from '@/api/control/index.js'
export default {
	components: {
		hmdItem,
		msrItem,
		carItem,
		devicesTree
	},
	data() {
		return {
			timer: null,
			indexS: 1,
			indexNum: 1,
			current: 0,
			swiperDotIndex: 0,
			hmdList: [],

			isActive: 1,
			navList: [{
				index: 1,
				title: this.$t('warn:blacklistAlarm')
			}, {
				index: 2,
				title: this.$t('warn:strangerAlarm')
			}, {
				index: 7,
				title: this.$t('warn:vehicleAlarm')
			}],
			userFeedbackHidden: true, //默认隐藏

			// 人像库list
			dataTree: [],
			// facedbIdList: [],
			//黑名单查询条件
			// formRecog: {
			// 	facedbIds: [],
			// 	deviceIds: [],
			// 	startTime: '',
			// 	nodeList: [],
			// 	endTime: '',
			// 	faceCardId: '',
			// 	monitorIds: [],
			// 	customMonitorLevelId: '',
			// 	faceName: '',
			// 	judgementResult: '',
			// 	vehiclePlateNumber: '',
			// 	cardbIds: '',
			// 	vehicleType: '',
			// 	userId: localStorage.getItem("userId"),
			// 	sort: 'desc'
			// },
			formRecog: {
				startTime: '',
				endTime: '',
				alarmId: '',
				faceName: '',
				faceCardId: '',
				vehicleInfoPlateNumber: '',
				deviceIdList: [],
				facedbIds: [],
				monitorLevelId: '',
				vehicledbIds: '',
				monitorIds: [],
				ownerName: '',
				ownerIdCard: '',
				vehicleInfoVehicleType: '',
				isConcern: ''
			},
			nodeListCopy: this.$t('search:pleaseSelect'),
			sort: 'desc',
			treeChild: {
				text: "name",
				value: "id",
			},

			//布控任务list
			controlList: [],
			treeControl: {
				text: "monitorName",
				value: "monitorId",
			},

			// 报警等级list
			alarmLevelList: [],
			treeLevel: {
				text: "name",
				value: "monitorLevelId",
			},

			// 车辆库
			carTree: [],
			treeCarChild: {
				text: 'name',
				value: 'id'
			},

			vehicleTypeList: [],
			// 车辆库list
			// cardList: '',
			// treeCard: {
			// 	text: "name",
			// 	value: "monitorLevelId",
			// },
			// 排序list
			sortList: [
				{ text: this.$t('warn:desc'), value: "desc" },
				{ text: this.$t('warn:asc'), value: "asc" }
			],
			sort: 'desc',
			// 车辆类型list
			customMonitorLevelList: [
				{ text: this.$t('search:microCar'), value: "15" },
				{ text: this.$t('search:compactCar'), value: "17" },
				{ text: this.$t('search:smallCar'), value: "16" },
				{ text: this.$t('search:hatchback'), value: "18" },
				{ text: this.$t('search:sedan'), value: "19" },
				{ text: this.$t('search:lightVan'), value: "20" },
				{ text: this.$t('search:smallSuv'), value: "21" },
				{ text: this.$t('search:compactSuv'), value: "22" },
				{ text: this.$t('search:midSuv'), value: "23" },
				{ text: this.$t('search:coupe'), value: "28" },
				{ text: this.$t('search:largeSuv'), value: "24" },
				{ text: this.$t('search:fullSizeSuv'), value: "25" },
				{ text: this.$t('search:microVan'), value: "26" },
				{ text: this.$t('search:mpv'), value: "27" },
				{ text: this.$t('search:unknownOther'), value: "0" },
				{ text: this.$t('search:van'), value: "3" },
				{ text: this.$t('search:bus'), value: "4" },
				{ text: this.$t('search:midBus'), value: "7" },
				{ text: this.$t('search:pedestrian'), value: "9" },
				{ text: this.$t('search:schoolBus'), value: "10" },
				{ text: this.$t('search:dumpTruck'), value: "11" },
				{ text: this.$t('search:highRisk'), value: "12" },
				{ text: this.$t('search:cyclistPlaceholder'), value: "13" },
				{ text: this.$t('search:carPlaceholder'), value: "1" },
				{ text: this.$t('search:truckPlaceholder'), value: "2" },
				{ text: this.$t('search:smallTruckPlaceholder'), value: "5" },
				{ text: this.$t('search:suvPlaceholder'), value: "6" },
				{ text: this.$t('search:motorcycleNonMotor'), value: "8" },
				{ text: this.$t('search:miniTruck'), value: "29" },
				{ text: this.$t('search:pickup'), value: "30" },
				{ text: this.$t('search:midTruck'), value: "31" },
				{ text: this.$t('search:lightTruck'), value: "32" },
				{ text: this.$t('search:heavyTruck'), value: "33" },
				{ text: this.$t('search:taxi'), value: "34" },
				{ text: this.$t('search:tanker'), value: "35" },
				{ text: this.$t('search:crane'), value: "36" },
				{ text: this.$t('search:allModels'), value: "512" },
				{ text: this.$t('search:trailer'), value: "37" },
				{ text: this.$t('search:mixerTruck'), value: "38" },
				{ text: this.$t('search:fireTruck'), value: "40" },
				{ text: this.$t('search:escort'), value: "41" },
				{ text: this.$t('search:repairTruck'), value: "42" },
				{ text: this.$t('search:rescue'), value: "43" },
				{ text: this.$t('search:unknown'), value: "null" }
			],
			treeCustomMonitorLevel: {
				text: "name",
				value: "monitorLevelId",
			},

			is_concern_options: [{
				text: this.$t('search:yes'),
				value: 1
			},
			{
				text: this.$t('search:no'),
				value: 0
			}
			],

			//研判结果list
			judgmentResultsList: [{
				text: this.$t('warn:pendingReview'),
				value: 0
			},
			{
				text: this.$t('warn:confirm'),
				value: 1
			},
			{
				text: this.$t('warn:cancel'),
				value: 2
			},
			{
				text: this.$t('warn:doubtful'),
				value: 3
			}
			],
			judgmentResults: '',
			startTime: '',
			endTime: '',
		}

	},
	created() { },
	onLoad() {
		// 一天的毫秒数
		const MillisecondsADay = 24 * 60 * 60 * 1000 * 1
		// 当前时间戳
		var timestamp = Date.parse(new Date());
		// 昨天时间戳
		var timestampStart = timestamp - MillisecondsADay;
		this.startTime = timestampStart
		this.endTime = timestamp
		this.formRecog.startTime = timestampStart
		this.formRecog.endTime = timestamp

	},
	onShow() {
		this.faceDB()
		this.level()
		this.controlLis()
		this.getPages(this.indexNum)
		// var that = this
		// that.timer = setInterval(function() {
		// 	that.getPageSechedule(that.indexNum)
		// }, 10000)
	},
	onHide() {
		if (this.timer) {
			clearTimeout(this.timer);
			this.timer = null;
		}
	},
	onUnload() {
		if (this.timer) {
			clearTimeout(this.timer);
			this.timer = null
		}
	},
	methods: {
		// 设备选择
		equipment(index) {
			uni.navigateTo({
				url: `/pages/shebei/index?type=${index}`
			})
		},
		checked(index) {
			if (index === this.isActive) return
			this.clearFeedback()
			if (index == 1) {
				this.isActive = index
				// this.formRecog()
				this.submitFeedback()
			} else if (index == 2) {
				this.isActive = index
				this.submitFeedback()
			} else if (index == 7) {
				this.isActive = index
				this.submitFeedback()
			}
		},
		clearFeedback() {
			this.formRecog = {
				startTime: this.startTime,
				endTime: this.endTime,
				alarmId: '',
				faceName: '',
				faceCardId: '',
				vehicleInfoPlateNumber: '',
				deviceIdList: [],
				facedbIds: [],
				monitorLevelId: '',
				vehicledbIds: '',
				monitorIds: [],
				ownerName: '',
				ownerIdCard: '',
				vehicleInfoVehicleType: '',
				isConcern: ''
			}
			this.nodeListCopy = this.$t('search:pleaseSelect')
		},
		submitFeedback() {
			//布控等级
			if (this.formRecog.monitorIds && this.formRecog.monitorIds[0] == '') {
				this.formRecog.monitorIds = []
			}
			//人像库
			if (this.formRecog.facedbIds && this.formRecog.facedbIds[0] == '') {
				this.formRecog.facedbIds = []
			}
			//抓拍设备
			if (this.formRecog.deviceIds && this.formRecog.deviceIds[0] == '') {
				this.formRecog.deviceIds = []
			}
			if (this.isActive == 1) {
				this.getPages(1)
				this.userFeedbackHidden = true;

			} else if (this.isActive == 2) {
				this.getPages(2)
				this.userFeedbackHidden = true;
			} else if (this.isActive == 7) {
				this.getPages(7)
				this.userFeedbackHidden = true;
			}

		},
		showDiv() {
			this.userFeedbackHidden = false;
		},

		hideDiv() {
			this.userFeedbackHidden = true;
		},
		gotoPage(e, item) {
			if (e == 1) {
				// this.$tab.navigateTo('/pages/warning/components/blackList?alarmId=' + item.alarmId)
				// url: `/pages/search/jsjg/index?data=${encodeURIComponent(JSON.stringify(this.form))}&type=${index}`
				uni.navigateTo({
					url: `/pages/warning/components/blackList?data=${encodeURIComponent(JSON.stringify(item))}&alarmId=${item.alarmId}`
				})
			} else if (e == 2) {
				// this.$tab.navigateTo('/pages/warning/components/stranger?alarmId=' + item.alarmId + '&captureId=' + item.captureId)
				uni.navigateTo({
					url: `/pages/warning/components/stranger?data=${encodeURIComponent(JSON.stringify(item))}&alarmId=${item.alarmId}&captureId=${item.captureId}`
				})
			} else if (e == 7) {
				// this.$tab.navigateTo('/pages/warning/components/vehicle?alarmId=' + item.alarmId + '&captureId=' + item.captureId)
				uni.navigateTo({
					url: `/pages/warning/components/vehicle?data=${encodeURIComponent(JSON.stringify(item))}&alarmId=${item.alarmId}&captureId=${item.captureId}`
				})
			}
		},
		replaceData(arr, brr) {
			var crr = []
			for (var i = 0; i < arr.length; i++) {
				var flag = false
				for (var j = 0; j < brr.length; j++) {
					if (arr[i].alarmId == brr[j].alarmId) {
						flag = true
					}
				}
				if (!flag) {
					crr.push(arr[i])
				}
			}
			for (var i = 0; i < crr.length; i++) {
				this.hmdList.unshift(crr[i])
			}
			console.log('替换')
		},
		getPageSechedule(e) {
			this.indexNum = e
			//this.hmdList = []
			//this.indexS = 2
			//this.clearFeedback()
			if (e == 0) {
				var params = {
					"pageSize": 10,
					"pageIndex": 1,
					"searchParams": this.formRecog
				}
				getHmdNo(params).then(res => {

					var arr = res.data
					var brr = this.hmdList
					this.replaceData(arr, brr)


					//this.hmdList = res.data
				})
			} else if (e == 1) {
				var params = {
					"pageSize": 10,
					"pageIndex": 1,
					"searchParams": {
						"deviceIds": this.formRecog.deviceIds,
						"nodeList": this.formRecog.nodeList,
						"startTime": this.formRecog.startTime,
						"endTime": this.formRecog.endTime,
						"monitorIds": [],
						// "monitorIds": this.formRecog.monitorIds,
						"customMonitorLevelId": this.formRecog.customMonitorLevelId,
						"userId": localStorage.getItem("userId"),
						"sort": this.sort
					}
				}
				getMsrNo(params).then(res => {
					//this.hmdList = res.data
					var arr = res.data
					var brr = this.hmdList
					this.replaceData(arr, brr)
				})
			} else if (e == 2) {
				var params = {
					"pageSize": 10,
					"pageIndex": 1,
					"searchParams": {
						"vehiclePlateNumber": this.formRecog.vehiclePlateNumber,
						"deviceIds": [],
						"nodeList": this.formRecog.nodeList,
						"judgementResult": this.formRecog.judgementResult,
						"startTime": this.formRecog.startTime,
						"endTime": this.formRecog.endTime,
						"vehicleType": this.formRecog.vehicleType,
						"monitorIds": this.formRecog.monitorIds,
						"userId": localStorage.getItem("userId"),
						"sort": this.sort
					}
				}
				getCarNo(params).then(res => {
					//this.hmdList = res.data
					var arr = res.data
					var brr = this.hmdList
					this.replaceData(arr, brr)
				})
			}
		},
		getPages(e) {
			this.indexNum = e
			this.hmdList = []
			this.indexS = 2
			const filtered = Object.fromEntries(
				Object.entries({
					...this.formRecog,
					startTime: null,
					endTime: null,
					isConcern: this.formRecog.isConcern === 1 ? true : this.formRecog.isConcern === 0 ? false :
						null
				})
					.filter(([, v]) => v !== null && v !== '' && (!Array.isArray(v) || v.length))
			);
			var params = {
				"currentPage": 1,
				"pageSize": 10,
				"timeType": 30,
				"alarmTime": [this.formRecog.startTime, this.formRecog.endTime],
				"monitorType": this.isActive.toString(),
				...filtered
			}
			if (e == 7) {
				params.treeQueryParams = this.formRecog.deviceIdList.length > 0 ? {
					select: {
						deviceIds: this.formRecog.deviceIdList
					}
				} : {},
					getCar(params).then(res => {
						this.hmdList = res.data.datas
					})
			} else {
				getHmd(params).then(res => {
					this.hmdList = res.data.datas
				})
			}
		},
		onSort(e) {
			this.sort = e.detail.value[0].value;
			this.formRecog.sort = e.detail.value[0].value;
		},
		facedbIds(e) {
			var arr = e.detail.value
			if (arr != null && arr.length > 0) {
				this.formRecog.facedbIds = [arr[0].value]
			} else {
				this.formRecog.facedbIds = []
			}
		},
		// 人像库下拉框
		faceDB() {
			DBFace2({
				isDelete: 1
			}).then(res => {
				this.dataTree = res.data
			})
		},
		// 报警等级下拉框
		level() {
			getAlarmLevel({
				currentPage: 1,
				pageSize: 9999
			}).then(res => {
				this.alarmLevelList = res.data.datas
			})
		},
		control() {
			let arr = []
			arr.push(this.formRecog.monitorIds)
			this.formRecog.monitorIds = arr
		},
		// 布控任务下拉框
		controlLis() {
			getFace({
				currentPage: 1,
				monitorTypes: [1, 2, 6],
				pageSize: 999
			}).then(res => {
				this.controlList = res.data.datas
			})
		},
		handleDevicesOpen() {
			this.userFeedbackHidden = true
			this.$refs.devicesTree.open()
		},
		setDevides(id, labels) {
			this.formRecog.deviceIdList = id
			this.nodeListCopy = labels || this.$t('search:pleaseSelect')
			this.userFeedbackHidden = false
		},
	},
	onPullDownRefresh() {
		this.hmdList = []
		setTimeout(() => {
			this.getPages(this.indexNum)
		}, 1000)
		setTimeout(function () {
			uni.stopPullDownRefresh();
		}, 1000);
	},
	onReachBottom() {
		const filtered = Object.fromEntries(
			Object.entries({
				...this.formRecog,
				startTime: null,
				endTime: null,
				isConcern: this.formRecog.isConcern === 1 ? true : this.formRecog.isConcern === 0 ? false :
					null
			})
				.filter(([, v]) => v !== null && v !== '' && (!Array.isArray(v) || v.length))
		);
		var params = {
			"currentPage": this.indexS++,
			"pageSize": 10,
			"timeType": 30,
			"alarmTime": [this.formRecog.startTime, this.formRecog.endTime],
			"monitorType": this.isActive.toString(),
			...filtered
		}
		if (this.isActive == 7) {
			params.treeQueryParams = this.formRecog.deviceIdList.length > 0 ? {
				select: {
					deviceIds: this.formRecog.deviceIdList
				}
			} : {}
			getCar(params).then(res => {
				for (var i = 0; i < res.data.datas.length; i++) {
					this.hmdList.push(res.data.datas[i])
				}
				if (res.data.datas.length === 0) {
					uni.showToast({
						title: this.$t('warn:noMoreData'),
						icon: 'none',
						duration: 1000
					});
				}
			})
		} else {
			getHmd(params).then(res => {
				for (var i = 0; i < res.data.datas.length; i++) {
					this.hmdList.push(res.data.datas[i])
				}
				if (res.data.datas.length === 0) {
					uni.showToast({
						title: this.$t('warn:noMoreData'),
						icon: 'none',
						duration: 1000
					});
				}
			})
		}

	}
}
</script>

<style scoped>
/* #ifndef APP-NVUE */
page {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	background-color: #fff;
	min-height: 100%;
	height: auto;
}

view {
	font-size: 14px;
	line-height: inherit;
}

/* #endif */

.text {
	text-align: center;
	font-size: 26rpx;
	margin-top: 10rpx;
}


.tab_box {
	height: 44px;
	/* padding: 20rpx 0; */
	background-color: #3d5bff;
	display: flex;
	align-items: center;
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 9;
}

.tab_nav {
	display: flex;
	align-items: center;
	justify-content: space-around;
	background-color: #3f7df8;
	font-size: 28rpx;
	color: #fff;
	border-radius: 50rpx;
	width: 80%;
	margin: 0 auto;

}

.nav_item {
	margin-top: 105rpx;
}

.icon-search {
	position: absolute;
	right: 16rpx;
	top: 12px;
	color: #fff !important;
}

.tab_nav .navTitle {
	justify-content: center;
	align-items: center;
	opacity: .9;
	width: 205rpx;
	text-align: center;

}



.tab_nav .navTitle view {
	font-size: 28rpx;
}

.active {
	color: #2979ff;
	background-color: #fff;
	padding: 10rpx 0;
	text-align: center;
	border-radius: 50rpx;
	font-size: 28rpx;

}

/* 弹出框样式 */
.popup_overlay {
	position: fixed;
	top: 105rpx;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index: 5;
	-moz-opacity: 0.8;
	opacity: .80;
	filter: alpha(opacity=88);
}

.popup_content {
	max-height: 85vh;
	position: fixed;
	top: 44px;
	left: 0;
	right: 0;
	width: 100%;
	background-color: white;
	z-index: 50;
	overflow: auto;
	padding: 30rpx;
	z-index: 1000;
	/* height: calc(100vh - 44px - 50px); */
}

.line {
	display: flex;
	align-items: center;
	padding: 20rpx 0;
}

.popup_title {
	width: 32%;
	text-align: left;
	font-size: 32rpx;
	padding-right: 20rpx;
}

.popup_textarea_item {
	height: 70rpx;
	width: 68%;
	background-color: #F1F1F1;
	border-radius: 11rpx;
}

.popup_textarea {
	padding: 0 20rpx;
	font-size: 26rpx;
	height: 70rpx;
	line-height: 70rpx;
}

.btn {
	margin-top: 20rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 40rpx;
}

.popup_button {
	color: #fff;
	height: 60rpx;
	line-height: 60rpx;
	width: 200rpx;
	font-size: 32rpx;
}

::v-deep .uni-mask {
	top: 105rpx;
}

::v-deep .uni-column {
	height: 70rpx;
	line-height: 70rpx;
	padding: 0 20rpx;
}

::v-deep .uni-stat__select {
	height: 70rpx;
	line-height: 70rpx;
}

::v-deep .uni-select__input-text {
	width: 100% !important;
	font-size: 26rpx;
	color: grey;
}

::v-deep .uni-select {
	border: transparent;
	padding: 0 20rpx;
}

::v-deep .uniui-clear {
	font-size: 34rpx !important;
}

/* 表单样式 */
::v-deep .uni-forms-item {
	margin: 0;
	padding: 8px 0;
}

::v-deep .uni-forms-item__label {
	height: 70rpx;
	line-height: 70rpx;
}

::v-deep .uni-forms-item__content {
	height: 70rpx;
	line-height: 70rpx;
	font-size: 26rpx;
	color: grey;
	background-color: #F1F1F1;
	border-radius: 4px;
}

::v-deep .placeholder {
	font-size: 26rpx;
}

/* 下拉框 */
::v-deep .input-value {
	height: 70rpx;
	line-height: 70rpx;
	font-size: 26rpx;
	color: grey;
}

::v-deep .text-color {
	color: grey;
}


::v-deep .input-value-border {
	border: transparent;
}

.uni-picker-container .uni-picker-custom {
	top: 0;
}

/* 日期样式修改 */
::v-deep .uni-date {
	padding: 0 20rpx;

}

::v-deep .uni-date-editor {
	height: 70rpx;
	line-height: 70rpx;
}

::v-deep .uni-date-editor--x {
	height: 100%;
	border: transparent;
}

::v-deep .uni-date-x {
	padding: 0;
	background-color: transparent;
}

/* ::v-deep .uni-date-editor--x .uni-date__icon-clear {
		padding: 0;
	} */
::v-deep .uni-date__x-input {
	font-size: 26rpx;
}

.sbBox {
	width: 428rpx;
	line-height: 72rpx;
	padding: 0 10rpx 0 20rpx;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
</style>